<template>
	<view class="example">
		<text class="title">基础使用 - `type='date'`</text>

		<view class="type-list">
			<text :class="{active:type==item}" @click="()=>type=item" v-for="item in ['date','time','datetime','month','year-month','year']"
				:key="item">{{item}}</text>
		</view>
		<ifun-date-picker :type="type" @ok="handleConfirm">

		</ifun-date-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: 'datetime'
			}
		},
		methods: {
			handleConfirm(value, values) {
				console.log(value, values)
			}
		}
	}
</script>

<style lang="less" scoped>
	.example{
		.type-list{
			margin: 15px 0 ;
			display: flex;
			gap:10px;
			flex-wrap: wrap;
			text{
				border: 1px solid #eee;
				padding:5px 10px;
				&.active{
					border-color: aqua;
				}
			}
		}
	}
</style>